<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>短租自驾</title>
<link rel="stylesheet" href="${cxt }/css/yk_base.css" />
<link rel="stylesheet" href="${cxt }/css/yk_duan_shuan.css" />
<script type="text/javascript" src="${cxt }/js/jquery-3.2.1.js" ></script>
<script type="text/javascript" src="${cxt }/js/yk_myCenter_duan.js" ></script>
<script src="${cxt }/js/ls-base.js"></script>

<script>
	$(function(){
		$("#fromDate").val($.getDate()).css("color","#000");
		$("#toDate").val($.getDate()).css("color","#000");
		$(".zc_blue_sub").click(function(){
			$("#content").empty();
		})
		function getTime(str){
			
			 var oDate = new Date(str);
			 var oYear = oDate.getFullYear();
	         var oMonth = oDate.getMonth()+1;  
	         var oDay = oDate.getDate();
	         var oTime = getzf(oYear)+'-'+getzf(oMonth) +'-'+ getzf(oDay);//最后拼接时间  
	         return oTime;  
		}
		 function getzf(num){  
	            if(parseInt(num) < 10){  
	                num = '0'+num;  
	            }  
	            return num;  
	     }
		 function showEpOrder(data){
				$("#content").empty();
				var listdata=data.ist;
				for(var i=0;i<listdata.length;i++){
					$("#content").append('<tr>'+
															'<td style="text-align:center;">'+
					'								<p style="text-indent:2em;">订单号：'+listdata[i].eo_order_id+'</p>'+
					'							</td>'+
					'							<td>'+
					'						'+
					'								'+
					'							</td>'+
					'							<td>'+
					'								<div class="ol-caraddress" style="cursor: default;">'+
					'									<p class="qhicon">'+
					'										<i class="zc_fetch_i"></i>车时间'+
					getTime(listdata[i].eo_reserve_get_time.time) 	+
					'									</p>'+
					'									<p class="qhtime"></p>'+
					'									<p class="qhicon">'+
					'										<i class="zc_giveback_i"></i>车时间'+
															listdata[i].eo_fact_return_time+
					'									</p>'+
					'									<p class="qhtime"></p>'+
					'									<div class="ol-trace-bd">'+
					'										<i></i>'+listdata[i].eo_fact_return_time +
					'									</div>'+
					'								</div>'+
					'							</td>'+
					'							<td>'+
					'								<div class="ol-aggregate" style="height: 100px;">'+
					'									￥'+listdata[i].eo_plan_money +
					'									<span></span>'+
					'									'+
					'								</div>'+
					'							</td>'+
					'							<td>'+
					'								'+
					'								<span class="s-gray" style="color: #93939e;">'+listdata[i].eo_order_status+'</span>'+
					'								<a href="${cxt }/enterprise/index?content=ls_enterprise/myCenter/orderdetail" class="a-view" target="_blank">查看订单</a>'+
					'							</td>'+
					'							</tr>');
			
					/* $("<tr><td style='text-align:center;'><p style='text-indent:2em;'>订单号："+listdata[i]['eo_order_id']+"</p></td><tr>").appendTo($("#content")); */
					
				} 
				console.log(data);
		 }
		$("#query").click(function(){
			$.ajax({
				url:"${cxt}/enterprise/ordermanager/mulquery",
				success:function(data){
					showEpOrder(data);
				},
				dataType:"json",
				data: {startTime:$("#fromDate").val(), endTime:$("#toDate").val(),state:'全部',pageSize:'3',currpage:'1'},
			})
		});
		$(".subbox button").click(function(){
			var _this=this;
			$.ajax({
				url:"${cxt}/enterprise/ordermanager/mulquery",
				success:function(data){
					showEpOrder(data);
					var sz=$(".sz_page");
					sz.empty();
					
					for(var i=0;i<data.pageNum;i++){
						sz.append($("<a>"+(i+1)+"</a>"))
					}
				},
				dataType:"json",
				data: {startTime:$("#fromDate").val(), endTime:$("#toDate").val(),state:$(_this).text(),pageSize:'3',currpage:'1'},
			})
			return false;
		});
		
		
	})
</script>
<style>
	.sz_page a{
		cursor:pointer;
	}
	.subbox button{
	height: 34px;
	line-height: 34px;
	font-size: 14px;
	min-width: 90px;
	color: black;
	border: 1px solid #e9ebee;
	background-color: #f8f8fa;
	color: #93939e;
	text-align: center;
	cursor:pointer;
}
.subbox button:hover{
	    background-color: #fac10a;
}
</style>
</head>
<body>
	<div style="width:100%;background: #F2F3F5;">
			<div class="duan">
				<div class="head">
					<span class="order" style="color:#808080 ;">自驾订单</span>
					<div class="zc_box">
						<input type="date" id="fromDate" class="w175 zc_iptcalendar"/>
						<span>-</span>
						<input type="date" id="toDate" class="w175 zc_iptcalendar"/>
						<a style="display:inline-block;"><input type="button" value="查询" class="zc_gray_sub pointer" id="query"/></a>
						<input type="button" value="清除" class="zc_blue_sub pointer"/>
					</div>
					<div class="subbox fl">
						<button class="fl"  id="all">全部</button>
						<button class="fl"  id="wait">已预约</button>
						<button class="fl" id="order">租赁中</button>
						<button class="fl"  id="ing">已完成</button>
						<button class="fl"  id="end">已取消</button>
						<div class="cl"></div>
					</div>
					<div class="content" >
						<table class="zc_table_order" cellpadding="0" cellspacing="0">
							<thead>
								<tr>
									<th class="al" width="167px">订单信息</th>
									<th width="197"></th>
									<th width="263" class="al">取/还车信息</th>
									<th width="110" class="ac">总计</th>
									<th width="100" class="ac">订单状态</th>
								</tr>
							</thead>
							<tbody id="content">
								<c:forEach items="${orders}" var="order">
									<tr>
									<td style="text-align:center;">
										<p style="text-indent:2em;">订单号：${order.eo_order_id}</p>
									</td>
									<td>
								
										
									</td>
									<td>
										<div class="ol-caraddress" style="cursor: default;">
											<p class="qhicon">
												<i class="zc_fetch_i"></i>车时间
												${order.eo_reserve_get_time }	
											</p>
											<p class="qhtime"></p>
											<p class="qhicon">
												<i class="zc_giveback_i"></i>车时间
												${order.eo_fact_return_time }	
											</p>
											<p class="qhtime"></p>
											<div class="ol-trace-bd">
												<i></i>${order.eo_fact_return_time }
											</div>
										</div>
									</td>
									<td>
										<div class="ol-aggregate" style="height: 100px;">
											￥${order.eo_plan_money }
											<span></span>
											
										</div>
									</td>
									<td>
										
										<span class="s-gray" style="color: #93939e;">${order.eo_order_status}</span>
										<a href="${cxt }/enterprise/index?content=ls_enterprise/myCenter/orderdetail" class="a-view" target="_blank">查看订单</a>
									</td>
									</tr>
								</c:forEach>
							</tbody>
						</table>
					</div>
					<div class="sz_page_box">
						<div class="sz_page">
							<a href="javascript:void(0)">1</a>
							<a href="javascript:void(0)">2</a>
							<a href="javascript:void(0)">3</a>
							<a href="javascript:void(0)">4</a>
						</div>
					</div>
				</div>
				<div class="orderstate_bd">
					<h3>订单状态说明</h3>
					<ul>
						<li>
							<span class="s-green">已预定</span>
							<p>订单已确认，尚未提车</p>
						</li>
						
						<li>
							<span class="s-blue">租赁中</span>
							<p>车辆正在租赁过程中</p>
						</li>
						<li>
							<span class="s-yellow">已完成</span>
							<p>已还车，订单结算完毕</p>
						</li>
						<li>
							<span class="s-grey">已取消</span>
							<p>订单已经取消</p>
						</li>
					</ul>
				</div>
				<div class="notice_bd">
					<h3>注意事项</h3>
					<p>1.修改或取消订单，请您尽早致电400 616 6666申请，送车上门或服务点订单请至少在我们的工作时间内（08:00-20:00）提前2小时修改；</p>
					<p>2. 预付订单，逾时不履行或取消的，退还您预付款中的基本保险、手续费及可选服务费款项，已付费用将作为违约金恕不退还；</p>
					<p>3. 系统将为您保留一年之内的订单，如需查询更早的订单，请致电24小时热线。</p>
				</div>
			</div>
			
		</div>
</body>
</html>